import React from 'react';
import { history } from 'umi'
import { Table, Icon as AntIcon } from 'antd';
import { Icon } from '@/pages/Recruitment/components';
import { formatAssessLevel } from '@/pages/Informal/utils';

const TYPE_MAP = {
    weekly: '周评',
    monthly: '月评',
    quarterly: '季评'
};

const TAG_MAP = {
    0: <span style={{ color: '#F5222D' }}>不合格</span>,
    1: '合格',
    2: <span style={{ color: '#F5222D' }}>需观察</span>
};

const ResultTable = ({ dataSource = [], levels = [] }) => {
    const columns = [
        {
            title: '评估类型',
            dataIndex: 'period',
            width: 140,
            render: text => TYPE_MAP[text]
        },
        {
            title: '考评周期',
            dataIndex: 'periodStart',
            render: (text, row) => `${text.replace(/-/g, '/')} ~ ${row.periodEnd.replace(/-/g, '/')}`
        },
        {
            title: '能力综合分',
            dataIndex: 'score',
            render: (score, row) => {
                let r = '';
                const level = formatAssessLevel(levels, row.level);
                switch (level) {
                    case 1:
                        r = <span style={{ color: '#F5222D' }}>{`${score} / ${row.level}`}</span>;
                        break;
                    case 3:
                        r = <span style={{ color: '#5590F6' }}>{`${score} / ${row.level}`}</span>;
                        break;
                    default:
                        r = `${score} / ${row.level}`;
                        break;
                }
                return r;
            }
        },
        {
            title: '人事意见',
            dataIndex: 'evaluationType',
            width: '0px',
            render: text => TAG_MAP[text] || '-'
        },
        {
            title: '系统评估',
            children: [
                {
                    title: '任务结果',
                    dataIndex: 'taskResult',
                    align: 'center',
                    render: text => TAG_MAP[text] || '-'
                },
                {
                    title: '考勤情况',
                    dataIndex: 'attendanceResult',
                    align: 'center',
                    render: text => TAG_MAP[text] || '-'
                },
                {
                    title: '季度绩效',
                    dataIndex: 'performanceResult',
                    align: 'center',
                    render: text => TAG_MAP[text] || '-'
                }
            ]
        },
        {
            title: '操作',
            dataIndex: 'operation',
            align: 'center',
            width: 100,
            render: (text, row) => (
                <Icon
                    title="查看详情"
                    type="chakanxiangqing"
                    onClick={() => {
                        history.push({
                            pathname: '/office/personnelManagement/onboardAndLeave/informal/process/detail',
                            query: { id: row?.detailId || '' },
                            state: { tabRoute: true, tabRefresh: true }
                        });
                    }}
                />
            )
        }
    ];

    return (
        <Table
            rowKey="id"
            bordered
            dataSource={dataSource}
            columns={columns}
            pagination={false}
            scroll={{ x: 'max-content' }}
            expandIcon={({ expanded, record, onExpand }) =>
                record?.children && record?.children.length > 0 ? (
                    <AntIcon
                        type={expanded ? 'caret-down' : 'caret-right'}
                        style={{ fontSize: 12, marginRight: 8 }}
                        onClick={onExpand}
                    />
                ) : (
                    <div style={{ fontSize: 12, marginRight: 8 }} />
                )
            }
        />
    );
};

export default ResultTable;
